<template>
  <div class="content" v-loading="allloading" :style="{backgroundImage: backurl}">
    <div :is="pageconfig[pageconfig.theme].headmod" :bandata.sync="pageconfig[pageconfig.theme]" :pagedata="pageconfig" v-on:setmod="showsetbox"
      :taskdata="taskdata"></div>
    <div class="con clearfix" v-if="pageconfig[pageconfig.theme].layout=='two'">
      <div class="module" v-for="(item,index) in container.items" v-if="taskdata.Mode!=2||item.id!='TicketType'" :key="index" v-show="DesignMode||item.visible">
        <div :is="item.loadType" :ref="item.id" :moddata="item" :index="index" v-on:setmod="showsetbox" v-on:delreq="delmod" :taskdata="taskdata" :designmode="DesignMode"
          v-if="taskdataloaded"></div>
      </div>
    </div>
  </div>
</template>

<script>
  import banner2 from './banner2.vue'
  import banner3 from './banner3.vue'
  import EventModule from './EventModule.vue'
  import BasicModule from './BasicModule.vue'
  // import Tickettype from './Tickettype.vue'
  import TimeLocation from './TimeLocation.vue'
  import EventDetails from './EventDetails.vue'
  // import Sponsor from './Sponsor.vue'
  import MyMod from './MyMod.vue'
  


  export default {
    props: ["taskdata", "allloading", "pageconfig", "container", "taskdataloaded"],
    components: {
      banner2,
      banner3,
      EventModule,
      BasicModule,
      // Tickettype,
      TimeLocation,
      EventDetails,
      // Sponsor,
      MyMod
    },
    data() {
      return {
        DesignMode:window.Parameters.action=="DesignPm"
      }
    },
    mounted() {
      if (window.windowHeight) {
        $(".content").css("min-height", window.windowHeight + "px");
      }
    },
    computed: {
      backurl() {
        if (this.pageconfig.theme == 'tradition2' || this.pageconfig.theme == 'tradition3') {
          return 'url(' + this.pageconfig[this.pageconfig.theme].background + ')'
        } else {
          return ""
        }
      }
    },
    methods: {
      showsetbox(id, index, type) {
        this.$emit('setmod', id, index, type)
      },
      delmod(index) {
        this.$emit("delreq", index)
      }
    }
  }
</script>

<style scoped lang="less">
  .itemlist:nth-child(odd) {
    background: #ffffff;
  }

  .itemlist:nth-child(even) {
    background: #f0f4f6;
  }

  .tradition2,
  .tradition3 {
    .content {
      background-size: 100% 100%;
      background-repeat: repeat;
    }
  }
</style>